---
title: UI 概要
---

import { UIArchitecture } from '@/components/ui-architecture'

## アーキテクチャ

Univer のベース UI は、以下の図に基づいて設計されています：

<UIArchitecture />

さまざまなプラグインを組み合わせることで、ベースに様々な機能とビューが追加され、最終的に完全なアプリケーションが形成されます。

## デザインシステム

Univerのデザインシステムは Tailwind CSS をベースに構築されており、レンダリングエンジンによって再利用される一連のデザイントークンを作成し、レンダリングエンジンとビューレイヤー間のスタイルの一貫性を保証しています。これらのトークンを変更することで、アプリケーションのスタイルをカスタマイズできます。これらのトークンは `@univerjs/themes` パッケージに格納されています。
